import React, { Component } from 'react';
import axios from 'axios';
import {
  StyleSheet,
  Text,
  View,
  TextInput,
  TouchableHighlight,
} from 'react-native';
import { router } from 'expo-router'
import AsyncStorage from '@react-native-async-storage/async-storage';

export default class Login extends Component {
  state = {
    user: 'admin',
    password: '123',
  };


  dologin = async () => {
    let { data } = await axios.get(`http://192.168.13.227:3000/yjx/showuser`, { params: { user: this.state.user, password: this.state.password } })
    if (data.code === 200) {
      router.push('/(tabs)/home')
      AsyncStorage.setItem('userInfo',JSON.stringify(data.data))


    } else if (data.code === 400) {
      alert('没有该用户')
    }
  }






  render() {
    return (

      <View style={styles.container}>
        <Text style={styles.agreementTexts}>密码登录</Text>
        <View style={styles.item}>
          <Text style={styles.textStyle}>用户帐号：</Text>
          <TextInput
            // ref={(ref) => (this.inputLoginName = ref)}
            autoFocus={true}
            underlineColorAndroid="gray"
            placeholder="请输入用户名"
            clearTextOnFocus={true}
            clearButtonMode="while-editing"
            style={{ flex: 1 }}
            onChangeText={(input) => this.setState({ user: input })}
          />
        </View>
        <View style={styles.item}>
          <Text style={styles.textStyle}>用户密码：</Text>
          <TextInput
            secureTextEntry={true}
            // ref={(ref) => (this.inputLoginPwd = ref)}
            underlineColorAndroid="gray"
            placeholder="请输入密码"
            clearTextOnFocus={true}
            clearButtonMode="while-editing"
            style={{ flex: 1 }}
            onChangeText={(input) => this.setState({ password: input })}
          />
        </View>
        <TouchableHighlight
          style={styles.login}
          underlayColor="transparent"
          onPress={() => {
            this.dologin()
          }}
        >
          <Text style={styles.loginText}>登录</Text>
        </TouchableHighlight>
        <View style={{ flexDirection: 'row', justifyContent: 'space-around' }}>
          <Text
            onPress={() => {
              router.push('/LoginModel/cclogin')
            }}
          >验证码登录</Text>
          <Text
            onPress={() => {
              router.push('/LoginModel/MainPage')
            }}
          >注册</Text>
        </View>
        <Text style={styles.agreementText}>
          登录即代表同意《用户协议》和《隐私协议》
        </Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: 'white'
  },
  item: {
    flexDirection: 'row',
    alignItems: 'center',
    margin: 10,
  },
  textStyle: {
    fontSize: 18,
    color: 'black',
    marginRight: 10,
  },
  login: {
    height: 40,
    backgroundColor: 'green',
    margin: 20,
    justifyContent: 'center',
  },
  loginText: {
    fontSize: 20,
    alignSelf: 'center',
    color: '#FFF',
  },
  agreementText: {
    fontSize: 12,
    color: 'gray',
    marginTop: 10,
    textAlign: 'center',
  },
  agreementTexts: {
    fontSize: 30,
    fontWeight: 'bold',
    color: '#99cc33',
    marginBottom: 45,
    textAlign: 'center',
    // paddingLeft: 10,
  },
});


